<template>
	<div>
	    <!-- <div class="main_operation">
	        <div class="operation_left" >
	            <a-button class="mr10" type="primary" @click="addBtn">添加</a-button>
	            <a-button class="mr10" type="danger" @click="batchDelBtn">批量删除</a-button>
	        </div>
	        <div class="operation_right">
				<a-select class="mr10" style="width: 150px" placeholder="选择信息">
            <a-select-option value="jack">综合信息</a-select-option>
            <a-select-option value="lucy">公司信息</a-select-option>
        </a-select>
				<a-input-search placeholder="请输入标题" enterButton="查询" @search="onSearch" />
	        </div>
	    </div> -->
	    <div class="main">
	        <a-table :pagination="false" :loading="tableLoad" :columns="Fields" :dataSource="dataLists.data"
            :rowKey="record => record.id"
            :scroll="{x: 1200, y: 500 }"
          >
          <template slot="status" slot-scope="text, record">
	            <a-button class="btn-error" type="primary" size="small" v-if="record.status == 0" @click="handleBtn(record)">未处理</a-button>
	            <a-button class="btn-success" v-if="record.status == 1" type="primary" size="small" @click="handleBtn(record)">已处理</a-button>
              <a-button class="btn-warning" v-if="record.status == 2" type="primary" size="small" @click="handleBtn(record)">处理中</a-button>
          </template>
          <template slot="action" slot-scope="text, record">
              <!-- <a-button size="small" class="mr5" type="primary" @click="editBtn(record)">编辑</a-button> -->
              <a-button v-if="routerShow($route,'feedback_delete')" size="small" type="danger" @click="delBtn(record)">删除</a-button>
          </template>
		    </a-table>
        <div class="pageBox">
          <a-pagination
            :total="dataLists.total"
            :showTotal="total => `共 ${total} 条数据`"
            :pageSize="dataLists.per_page"
            :defaultCurrent="1"
            @change="pageChange"
          />
        </div>
	    </div>
      <a-modal
        v-model="visible"
        title="处理状态"
      >
        <template slot="footer">
          <a-button class="btn-success" type="primary" @click="handle(1)">已处理</a-button>
          <a-button class="btn-warning" type="primary" @click="handle(2)">处理中</a-button>
          <!-- <a-button class="btn-error" type="primary" @click="handle(0)">未处理</a-button> -->
        </template>
        <p>请选择当前处理进度</p>
      </a-modal>
	</div>
</template>

<script>
  import { mapState, mapActions } from 'vuex';
    export default {
		name: "newsList",
		data(){
			return {
        /* 通用模块 */
          //列表
        tableLoad: false,//列表loading状态
        formList:{          //列表信息
        	page: 1
        },
        /* 通用模块end */
        visible: false,
        formItem: {
          id: '',
          status: '',
        }
			}
		},
    computed: {
    	...mapState({
    		Fields: state => state.feedback.Fields,
    		dataLists: state => state.feedback.dataLists,
    		requestCode: state => state.feedback.requestCode,
    	}),
    },
		mounted() {
        this.changeData()
    },
    methods: {
      ...mapActions({
      	getLists: 'feedback/getLists',     //列表
        dataDel: 'feedback/dataDel',        //删除
        handleStatus: 'feedback/handleStatus',        //状态更改
      }),
      /* 通用模块 */
        // 重新获取列表数据
      changeData(){
        this.tableLoad = true
        setTimeout(()=> {
          this.getLists(this.formList)
          this.tableLoad = false
        }, 800);
      },
        // 页码
      pageChange(page) {
      	this.formList.page = page;
      	this.getLists(this.formList)
      },
      /* 通用模块end */
      // 处理状态
      handleBtn(item){
        if (!this.routerShow(this.$route,'feedback_handleStatus')) {
        this.$error({
          title: '您没有权限，无法处理反馈，请联系管理员',
        });
        return null
      }
        this.visible = true
        this.formItem.id = item.id
      },
      // 处理状态
			handle(type) {
        console.log(type);
        this.formItem.status = type
        this.handleStatus(this.formItem)
        this.visible = false
        this.changeData()
			},
      //删除
      delBtn(item){
        const _this = this
        this.$confirm({
        	title: `您确定要删除该数据吗?`,
        	content: `删除后将不可恢复,请仔细核对!`,
        	okText: '确定',
        	okType: 'danger',
        	cancelText: '取消',
        	onOk() {
        		_this.dataDel(item.id)
        		_this.changeData()
        	},
        });
      },
    },
  }
</script>

<style  lang="less" scoped>
  .modalUl {
    font-size: 16px;
    li {
      margin-bottom: 10px;
      span {
        font-weight: bold;
        margin-right: 10px;
      }
      div{
        display: line;
        border: 1px solid #ccc;
      }
    }
  }
</style>
